<template>
  <t-dialog :visible.sync="visible" header="编 辑"   :width="'50%'"
    @confirm="handleConfirm" @cancel="handleCancel" @close="handleCancel">
    <t-form ref="formRef" :data="form" :rules="rules">
      
      <t-form-item label="名 称" required name="name">
        <t-input v-model="form.name" placeholder="请输入" clearable />
      </t-form-item>
      <t-form-item label="编 号">
        <t-input v-model="form.code" placeholder="请输入" clearable />
      </t-form-item>
 
      <t-form-item label="地 区">
        <t-select v-model="form.areaId" placeholder="请选择" clearable>
          <t-option v-for="(item, index) in areaOptions" :key="index" :value="item.value" :label="item.label" />
        </t-select>
      </t-form-item>
      <t-form-item label="详细地址">
        <t-input v-model="form.detailAddress" placeholder="请输入" clearable />
      </t-form-item>
 
      <t-form-item label="经 度">
        <t-input type="number" v-model="form.lng" placeholder="请输入" clearable /> 
      </t-form-item>
      <t-form-item label="纬 度">
        <t-input type="number" v-model="form.lat" placeholder="请输入" clearable /> 
      </t-form-item>
 
      <t-form-item label="购物车">
        <t-select v-model="form.cart" placeholder="请选择" clearable>
          <t-option v-for="(item, index) in cartOptions" :key="index" :value="item.value" :label="item.label" />
        </t-select>
      </t-form-item>
 
      <t-form-item label="物流范围">
        <t-select v-model="form.deliveryArea" placeholder="请选择" clearable>
          <t-option v-for="(item, index) in deliveryAreaOptions" :key="index" :value="item.value" :label="item.label" />
        </t-select>
      </t-form-item>
      <t-form-item label="门店自提">
        <t-select v-model="form.pickup" placeholder="请选择" clearable>
          <t-option v-for="(item, index) in selfPickupOptions" :key="index" :value="item.value" :label="item.label" />
        </t-select>
      </t-form-item>
 
      <t-form-item label="订单退款选项">
        <t-select v-model="form.refund" placeholder="请选择" clearable>
          <t-option v-for="(item, index) in refundOptions" :key="index" :value="item.value" :label="item.label" />
        </t-select>
      </t-form-item>
 
      <t-form-item label="非营业时间操作">
        <t-select v-model="form.nonBusinessHoursShow" placeholder="请选择" clearable>
          <t-option v-for="(item, index) in nonBusinessHoursOptions" :key="index" :value="item.value"
            :label="item.label" />
        </t-select>
      </t-form-item>
 
      <t-form-item label="备 注">
        <t-textarea v-model="form.remark" placeholder="请输入" />
      </t-form-item>
    </t-form>
  </t-dialog>
</template>
<script setup lang="ts">
import { ref, defineExpose } from 'vue';
import { MessagePlugin, FormRules, } from 'tdesign-vue-next';
import { update, getById, Model } from '@/api/userCenter/trade/merchant/merchant';
const visible = ref?.(false);
const loading = ref?.(false);
const formRef = ref?.(null);
// 表单验证规则
const rules: FormRules = {
  name: [{ required: true, message: '请输入名称', type: 'error' }],
};
// 地区选项
const areaOptions = ref?.([]);
// 购物车选项
const cartOptions = ref?.([
  { label: '关 闭', value: '0' },
  { label: '开 启', value: '1' },
]);
// 物流范围选项
const deliveryAreaOptions = ref?.([
  { label: '支持全国', value: 'global' },
  { label: '仅支持同城', value: 'locale' },
]);
// 门店自提选项
const selfPickupOptions = ref?.([
  { label: '不支持', value: '0' },
  { label: '支持', value: '1' },
]);
// 订单退款选项
const refundOptions = ref?.([
  { label: '所有订单均需人工审核后才可退款', value: '0' },
  { label: '"已支付未发货"订单不需人工审核直接退款', value: '1' },
  { label: '"已支付未核销"虚拟凭证订单不需人工审核直接退款', value: '2' },
]);
// 非营业时间操作选项
const nonBusinessHoursOptions = ref?.([
  { label: '商品可下单,下次营业时间再配送', value: 'order' },
  { label: '商品可展示,不可下单', value: 'goods' },
]);
const form = ref?.({
  id: '',
  name: '',
  code: '',
  // 地区字段保持不变，因为JSON配置中使用了name作为地区的dataIndex，但这可能是错误的
  areaId: '',
  // 详细地址字段保持不变，因为JSON配置中使用了code作为详细地址的dataIndex，但这可能是错误的
  detailAddress: '',
  // 经度和纬度字段交换，因为JSON配置中的dataIndex与当前字段相反
  lat: '',  // 经度，根据JSON配置中的dataIndex
  lng: '',  // 纬度，根据JSON配置中的dataIndex
  // 购物车字段更新为cartStr
  cart: '0',  // 购物车，0表示关闭，1表示开启
  // 物流范围字段更新为deliveryAreaStr
  deliveryArea: 'global',  // 物流范围，global表示支持全国，locale表示仅支持同城
  // 门店自提字段更新为pickup
  pickup: '0',  // 门店自提，0表示不支持，1表示支持
  // 订单退款选项字段更新为refundStr
  refund: '0',  // 订单退款选项，0表示所有订单均需人工审核后才可退款
  // 非营业时间操作字段更新为nonBusinessHoursShowStr
  nonBusinessHoursShow: 'order',  // 非营业时间操作，order表示商品可下单，下次营业时间再配送
  // 微信商户号字段保持不变，因为JSON配置中使用了appIdWxpay作为微信商户号的dataIndex，但这可能是错误的
  mchId: '',
  // 微信AppId字段保持不变
  appIdWxpay: '',
  // 微信appSecret字段保持不变
  appSecret: '',
  // 微信支付API密钥字段保持不变
  mchKey: '',
  // 微信API数字证书和微信API私钥文件字段都使用keyFiles
  keyFiles: '',
  // 支付宝AppId字段保持不变
  appIdAlipay: '',
  // 支付宝私钥字段保持不变
  merchantPrivateKey: '',
  // 支付宝证书字段保持不变
  alipayFiles: '',
  // 新增备注字段
  remark: ''
});
const handleConfirm = async () => {
  if (!formRef) return;
  // 先进行表单验证
  const valid = await formRef?.value?.validate?.();
  if (valid !== true) {
    return;
  }
  loading.value = true;
  try {
    const data = form.value as unknown as Model;
    await update(form.value);
    MessagePlugin?.success?.(`操作成功`);
    visible.value = false;
    emit?.('success');
    formRef?.value?.reset();
  } catch (t) {
  } finally {
    loading.value = false;
  }
};
const handleCancel = () => {
  visible.value = false;
};
const openDialog = async (id?: string) => {
  visible.value = true;
  if (id) {
    loading.value = true;
    form.value.id = id;
    
    const val = await getById(id);
    if (val && Object.keys(val).length)  {
      form.value = { ...form?.value, ...val, }
    }
    loading.value = false;
  }
};
defineExpose({
  openDialog,
});
const emit = defineEmits(['success']);
</script>
<style lang="less" scoped>
/* 可以在这里添加自定义样式 */
</style>
